import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex) //把vuex挂载到vue全局上
import createPersistedState from 'vuex-persistedstate'
import { getUserInfoAPI } from '@/api'
export default new Vuex.Store({ //new 一个 store 里面保存token和用户信息
  state: {
    token: '',// 用户token
    userInfo: {},// 定义用户信息对象
  },
  getters: {
    // username:(state) =>{
    //   return state.userInfo.username
    // }
    username: state => state.userInfo.username,// 昵称
    nickname: state => state.userInfo.nickname,// 用户名
    user_pic: state => state.userInfo.user_pic,// 用户头像
  },
  mutations: {
    // 更新 token 的 mutation 函数
    updateToken(state, val) {
      state.token = val
    },
    // 更新用户的信息
    updateUserInfo(state, val) {
      state.userInfo = val
    }
  },

  actions: {
    // 定义初始化用户基本信息的 action 函数
    async getUserInfoActions(store) {
      const res = await getUserInfoAPI()
      store.commit('updateUserInfo', res.data.data)
    }
  },
  plugins: [
    // 配置为 vuex 的插件
    createPersistedState()
  ],
})
//vuex不是持久化存储的， 使用持久话存储vuex-persistedstate@3.2.1